<form id="search_form" method="get">
<div class="widget-box condition ">
	<div class="widget-header  widget-header-small header-color-blue">
			<div class="widget-toolbar">
				<a  href="#" title="展开其他条件" data-action="collapse">
					<i class="1 icon-chevron-up bigger-125"></i>
				</a>
			</div>
        {% if auto_query %}
            <label title="自动刷新">自动刷新:
                <input id="auto_query_btn" class="ace ace-switch ace-switch-7" type="checkbox" value="true">
                <span class="lbl"></span>
            </label>
        {% endif %}
			<div id="search-toolbar" class="widget-toolbar no-border">
                <div class="btn-group" style="  top: 2px;">
{#                    <input  value="查询" type="submit" id="search_btn" class="btn btn-sm btn-success " />#}
                    <a id="a_submit" class="btn btn-sm btn-success ">查询</a>
                </div>
            </div>
	</div>
	<div class="widget-body padding-16 ">
        <div class="widget-body-inner" style="display: block;">
		    <table id="conditions-table" class="width-100 table">
				<tbody>
                {% if pro_objs %}
                    {% include "query/plugins/project_area.html" %}
                {% endif %}
                {% if bra_objs %}
                    {% include "query/plugins/branch_area.html" %}
                {% endif %}
                {% if plat_type %}
                    {% include "query/plugins/plat_area.html" %}
                {% endif %}
                {% if state_type %}
                    {% include "query/plugins/state_area.html" %}
                {% endif %}
                {% if task_type %}
                    {% include "query/plugins/task_area.html" %}
                {% endif %}
                {% if model_name == 'MachineTask' %}
                    <input type="checkbox" name="id" value="{{model.id}}" checked="checked" hidden="hidden">
                {% endif %}
                </tbody>
            </table>
	    </div>
	</div>
</div>
</form>
<script>
    {#oDatatable = {};#}
	{#$('.datatable').each( function(index, ele) {#}
        {#var tableObj = $(ele);#}
        // var request_url = $("#request_url").attr('href');
        {#var aoColumnDefs = ColumnDefs;#}
        opt = {
                "sAjaxSource": request_url,
                // "sServerMethod": "POST",
                "bSortClasses":false,
                "bStateSave": false,
                "bProcessing": false, //是否显示正在处理的提示
                "serverSide" : true,
                "iDisplayLength":5,//默认每页显示的记录数
                "bPaginate": true, // 是否使用分页
                "aLengthMenu":[5,10,100],
                "bAutoWidth": false,//列的宽度会根据table的宽度自适应
                //"bSortClasses":true,
                "bLengthChange": true,//分页栏
                "oSearch":{
                    "sSearch": "",//默认的框文字
                    "bRegex":true,//支持正则搜索
                },
                "bInfo": true,
                 "oLanguage": {
                 "sSearch": "筛选:",//
                 "sZeroRecords": "没有匹配记录",
                  "sInfo":'当前 _START_ - _END_ 条 共 _TOTAL_ 条',
                  "sInfoFiltered": "(从 _MAX_ 条记录中过滤)",
                  "sLengthMenu": "每页显示 _MENU_条",
                  "sProcessing":"正在加载数据...",
                  "sInfoEmpty": "",
                  "oPaginate": {
                    "sFirst": "首页",
                    "sPrevious": "前一页",
                    "sNext": "后一页",
                    "sLast": "尾页"
                    }
                 },
                "aaSorting":[], //默认不排序
                "aoColumnDefs": ColumnDefs,
            };
        // oDatatable = $(".datatable").DataTable(opt);
        // toolbarEle = $('#datatable_toolbar');
        // toolbarEle.appendTo(oDatatable.parent().find('.datatable_toolbar'));
        // oDatatable.find('.datatable-select-td').each( function ( i ) {
        // 	 $('select', this).change( function () {
        // 		 oDatatable.fnFilter( $(this).val(), i );
        // 	 });
        // });
    {# });#}
    function update_local_strorage() {
        var check_list = $('#search_form').find('[name]').serializeArray(),
            check_dict = {};
        for(var i in check_list){
            if(!check_dict[check_list[i].name]){
                check_dict[check_list[i].name] = [check_list[i].value]
            } else {
                check_dict[check_list[i].name].push(check_list[i].value)
            }
        }
        window.localStorage.{{model_name}} = JSON.stringify(check_dict);
    }

    function select_checkbox(){
        var checkbox_json = window.localStorage.{{model_name}};
        if(checkbox_json){
            var checkbox_dict = JSON.parse(checkbox_json);
            for(var i in checkbox_dict){
                for (var j in checkbox_dict[i]){
                    var s = $('#search_form').find(":checkbox[name='" + i + "'][value='" + checkbox_dict[i][j] + "']");
                    s.parent().attr("class", "checked");
                    s.attr("checked",true);
                }
            }
        }
     }

    $(function(){
        select_checkbox();
        $('#a_submit').click(function(){
            var aObjData = $('#search_form').find('[name]').serializeArray();
            var params = "";
            for (var item in aObjData){
                params += aObjData[item].name + "=" + aObjData[item].value + "&";
            }
            $('#{{model_name}}_table').dataTable().fnDestroy();
            opt.sAjaxSource = (request_url + "?" + params).replace(/([?&]$)/g,"");
            $('#{{model_name}}_table').DataTable(opt);
        });

        {% if auto_query %}
            var auto_query = $("#auto_query_btn");
            var interval = setInterval(click_submit, 5000);
            if (!auto_query.is(":checked")){
                auto_query.click();
            }
            auto_query.click(function() {
                if (auto_query.is(":checked")) {
                    interval = setInterval(click_submit, 5000)
                } else {
                    clearInterval(interval);
                }
            });
        {% endif %}

        click_submit();
        {#$('#search_form').find('[name]').click(update_local_strorage);#}
    })
</script>